<template>
  <div>
    <a-form :model="value" :form="form">
      <a-row :gutter="24">
        <a-col :md="24" :sm="24">
          <a-tabs defaultActiveKey="pc" @change="handleTabsChange">

            <a-tab-pane key="pc">
              <span slot="tab">
                <a-icon type="laptop" />
                产品详情
              </span>
              <a-form-item>
                <j-editor
                          v-model="value.detailHtml"
                          :action="uploadAction"
                          :data="{'isup':1,'dir':'goods/'+value.productSn+'/info/'}"
                          @change="handleDetailHtml" triggerChange/>
<!--                <j-editor v-if="pcReset"
                          v-model="value.detailHtml"
                          :action="uploadAction"
                          :data="{'isup':1,'dir':'goods/'+value.productSn+'/info/'}"
                          @change="handleDetailHtml" triggerChange/>-->
              </a-form-item>
            </a-tab-pane>

<!--            <a-tab-pane key="wap">
              <span slot="tab">
                <a-icon type="mobile" />
                移动版详情
              </span>
              <a-form-item>
                <j-editor v-if="wapReset"
                          v-model="value.detailMobileHtml"
                          :action="uploadAction"
                          :data="{'isup':1,'dir':'goods/'+value.productSn+'/info/'}"
                          @change="handleDetailMobileHtml" triggerChange/>
              </a-form-item>
            </a-tab-pane>-->

          </a-tabs>
        </a-col>
        <a-col :md="24" :sm="24" :style="{ textAlign: 'right' }">
          <a-form-item :wrapperCol="{span: 19, offset: 5}">
            <a-button  type="primary" @click="finish">提交</a-button>
            <a-button style="margin-left: 8px" @click="prevStep">上一步</a-button>
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
  </div>
</template>

<script>
  import JEditor from '../../../../components/jeecg/JEditor'
  import { ACCESS_TOKEN } from "@/store/mutation-types"
  import Vue from 'vue'
  export default {
    name: "ProductHtmlDetailJX",
    props: {
      value: Object
    },
    components: {
      JEditor
    },
    data () {
      return {
        visible: false,
        pcReset:true,
        wapReset:true,
        model: {},
        labelCol: {
          xs: { span: 24 },
          sm: { span: 6 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        hiding: true,
        confirmLoading: false,
        form: this.$form.createForm(this),
        url: {
          fileUpload: "/sys/common/ossUpload",
        },
      }
    },
    computed:{
      uploadAction:function () {
        return this.url.fileUpload;
      }
    },
    methods: {
      handleTabsChange(e) {
        if('pc' === e){
          console.log(e)
          this.pcReset = true;
          this.wapReset = false;
        }else if('wap' === e){
          console.log(e)
          this.pcReset = false;
          this.wapReset = true;
        }
      },
      handleDetailHtml (e) {
        console.log(e)
        this.value.detailHtml = e;
      },
      handleDetailMobileHtml (e) {
        console.log(e)
        this.value.detailMobileHtml = e;
      },
      nextStep () {
        let that = this
        that.loading = true
        setTimeout(function () {
          that.$emit('nextStep')
        }, 1500)
      },
      prevStep () {
        this.$emit('prevStep')
      },
      finish () {
        this.$emit('finish')
      },
    }
  }
</script>

<style lang="less" scoped>

</style>
